<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>登录页面</title>
		
		<link rel="stylesheet" type="text/css" href="vendor/bootstrap/css/bootstrap.min.css">
		<link rel="stylesheet" type="text/css" href="fonts/font-awesome-4.7.0/css/font-awesome.min.css">
		<link rel="stylesheet" type="text/css" href="fonts/iconic/css/material-design-iconic-font.min.css">
		<link rel="stylesheet" type="text/css" href="css/util.css">
		<link rel="stylesheet" type="text/css" href="css/main.css">
		
		<script src="js/axios.min.js" type="text/javascript" charset="utf-8"></script>
		<script src="js/vue.js" type="text/javascript" charset="utf-8"></script>
		
	
		
	</head>
	<body>
		<div id="app">
		<div class="limiter">
			<div class="container-login100" style="background-image: url('images/伞.png');">
				<div class="wrap-login100 p-l-55 p-r-55 p-t-65 p-b-54">
					
					<div class="login100-form validate-form">
						<span class="login100-form-title p-b-49">登录</span>
		
						<div class="wrap-input100 validate-input m-b-23" data-validate="请输入用户名">
							<span class="label-input100">用户名</span>
							<input v-model="admin.adminId" class="input100" type="text" placeholder="请输入用户名" autocomplete="off">
							<span class="focus-input100" data-symbol="&#xf206;"></span>
						</div>
						<div class="wrap-input100 validate-input" data-validate="请输入密码">
							<span class="label-input100">密码</span>
							<input v-model="admin.adminPwd" class="input100" type="password" placeholder="请输入密码">
							<span class="focus-input100" data-symbol="&#xf190;"></span>
						</div>
		
						<div class="text-right p-t-8 p-b-31">
							<a href="javascript:">忘记密码？</a>
						</div>
		
						<div class="container-login100-form-btn">
							<div class="wrap-login100-form-btn">
								<div class="login100-form-bgbtn"></div>
								<button class="login100-form-btn" @click="Login()">登 录</button>
							</div>
						</div>
		
						<div class="txt1 text-center p-t-54 p-b-20">
							<span>第三方登录</span>
						</div>
		
						<div class="flex-c-m">
							<a href="#" class="login100-social-item bg1">
								<i class="fa fa-wechat"></i>
							</a>
		
							<a href="#" class="login100-social-item bg2">
								<i class="fa fa-qq"></i>
							</a>
		
							<a href="#" class="login100-social-item bg3">
								<i class="fa fa-weibo"></i>
							</a>
						</div>	
					</div>
					
				</div>
			</div>
		</div>
		</div>
		
		
		
		<div id="content">
			<p id="name">杨小姐的甜酒铺</p>
			<p id="huangying">一家死磕甜酒的店铺</p>
		</div>
		
		<script type="text/javascript">
			let v=new Vue({
				el:"#app",
				data:{
					admin:{
						adminId:"",
						adminPwd:""
					}
				},
				methods:{
					Login(){
						axios.post("http://localhost/SweetWine/AdminLogin.action",this.admin)
						.then(res=>{
							console.log(res);
							if (res.data.flag=="LoginOK") {
								sessionStorage.setItem("item",JSON.stringify(res.data.admin));
								location.href="Pages.html";
							} else{
								alert("用户名或密码错误！！！");
							}
						})
					}
				}
			})
		</script>		
	</body>
</html>
